
<div class="toggle active">
    <label>Search.</label>
    <div class="toggle-content">

        <form data-example-id="input-group-with-button" class="bs-example bs-example-form" id="transaction-filter-form">
            <input type="hidden" id="trx-customerId" name="customerId" />
            <div class="row">
                <div class='col-sm-3'>
                    <div class="form-group">
                        <div class='input-group' >
                            <select id="search-transaction-type">
                                <option value="">ALL</option>
                                <option th:each="color : ${T(com.chandra.pos.common.model.TransactionType).values()}" th:value="${color}" th:text="${color.value}" ></option>
                            </select>

                        </div>
                    </div>
                </div>
                <div class='col-sm-6'>

                    <div class='input-group' id='dateRange'>
                        <input type='text' class="form-control pos-daterangepicker" id="search-transaction-dateRange" placeholder="From Date" />
                                        <span class="input-group-addon">
                                            <span class="glyphicon glyphicon-calendar"></span>
                                        </span>
                    </div>

                </div>
            </div>
        </form>

    </div>
</div>

<div>

    <div class="row padding10">
        <table id="customerTransactionGrid"></table>
        <div id="customerTransactionGridPager"></div>
    </div>
</div>





<script th:src="@{/js/transaction.js}"></script>